<template>
  <a-card :bordered="true" title="销售信息" style="margin-top: 24px">
    <a-tabs default-active-key="1" :tab-position="'left'"  v-if="">
      <a-tab-pane :key="item.id" :tab="item.attrName" v-for="item in innerModel.specList">
        <a-radio-group v-if="item.valueSelectList" v-model="item.specValue">
          <a-radio :value="ite" v-for="ite in item.valueSelectList" :key="ite">
            {{ ite }}
          </a-radio>
        </a-radio-group>
        <a-row  v-if="item.plainOptions">
          <a-checkbox-group v-model="item.specValue" :options="item.plainOptions" />
        </a-row>
      </a-tab-pane>
    </a-tabs>
    <a-form-model>
      <a-row style="display: flex;justify-content: center;margin-top: 24px">
        <a-button @click="prev">上一步</a-button>
        <a-button @click="onSubmit" type="primary" style="margin-left: 12px">下一步</a-button>
      </a-row>
    </a-form-model>
  </a-card>
</template>
<script>
import { getAction } from '../../../api/manage'

export default {
  props: {
    specModel: {
      type: Object
    }
  },
  watch: {
    specModel: {
      handler(newVal) {
        this.innerModel = newVal
      },
      deep: true
    },
    innerModel: {
      handler(newVal) {
        this.$emit('input', newVal)
      },
      deep: true
    }
  },
  created() {
  },
  data() {
    return {
      url: {
        initSaleList: '/product/attribute/initSaleList'
      },
      innerModel: {
        categoryId: '',
        specList: []
      }
    }
  },
  methods: {
    initCategoryId(categoryId) {
      if (this.innerModel.categoryId == '') {
        this.innerModel.categoryId = categoryId
        this.initSaleList()
      }
    },
    initSaleList() {
      getAction(this.url.initSaleList, { categoryId: this.innerModel.categoryId }).then(res => {
        this.innerModel.specList = res.result
      })
    },
    prev() {
      this.$emit('prev')
    },
    onSubmit() {
      this.$emit('next')
    }
  }
}

</script>
<style scoped>

</style>